﻿@{
    ViewBag.Title = "Index";
}

<script src="@Url.Content("~/Scripts/fullcalendar.min.js")"></script>
<link rel='stylesheet' type='text/css' href='@Url.Content("~/Content/fullcalendar.css")' />

<script language="javascript">
    $(function () {
       var calendarAppointmentsUrl = '@Url.Action("GetAppointmentsByRangeDate")';

        $('#fullCalendar').fullCalendar({
            monthNamesShort: $.datepicker.regional['pt-BR'].monthNamesShort,
            dayNamesShort:$.datepicker.regional['pt-BR'].dayNamesShort,
            events: {
                url: calendarAppointmentsUrl,
                cache: false
            },
            header: {
                left: 'prev,next today',
                right: 'month,agendaWeek,agendaDay'
            },
            buttonText: {
                today: 'hoje',
                month: 'mês',
                week: 'semana',
                day: 'dia'
            },
            select: function (start, end, allDay) {
                alert('ok criando um novo evento');
            },
            editable: false,
            selectable: true,
            theme: true,
            defaultView: 'agendaWeek',
            allDaySlot: false,
            slotMinutes:15,
            axisFormat: 'HH:mm',
            height:400
        });
    });
</script>

<div class="content-left">
    @Html.Partial("ContentLeftPartial")
</div>
<div class="content-right">
<h2>Index</h2>
        <div id="fullCalendar"></div>
        <p>&nbsp;</p>
</div>